<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
</head>
<body>
<!--
    form标签:表示一个表单
        表单中包含了许多的表单元素
        用户可以在表单元素中输入信息、选择信息等
        通过一定的方式,将用户输入的信息传递到后台服务器进行处理
    常见属性
        action:当表单提交之后跳转的URL地址
            其值类似于超链接的href属性
        method:请求提交方式
            其值有两种:
            get:默认值
                请求参数会在地址栏展现
                    ?username=admin&password=666666&gender=man&hobbies=eat&hobbies=sleep
                安全性较低
                无法实现文件上传
                传输的数据大小有限制,根据浏览器不同,阈值不同,一般不会超过2KB
                执行效率高
            post:
                请求参数不会再地址栏展现
                安全性较高
                可以实现文件上传
                理论上传输的数据无限制,不同的标准设置的阈值不一致,目前主流标准不超过80KB
                执行效率较低
        enctype:数据传输方式
            其值有三种
            application/x-www-form-urlencoded:默认值
                表示使用正常的数据传输
                将用户输入的值以字符串/字符串数组的方式进行传递
            multipart/form-data:
                将用户输入的数据以二进制流的方式进行传输
                该方式仅限文件上传时使用
            text/plain
                将用户输入的数据以普通文本的方式进行传输
                该方式目前不建议使用
-->
<form action="#" method="post" enctype="application/x-www-form-urlencoded">
    <!--
        input表单元素根据type属性定义类型,行级元素
        type属性取值如下
            text:单行文本框,即:普通输入框
            password:密码框
            radio:单选框
                同一组的单选框只能选择一个
                name属性值相同的单选框属于同一组单选框
                可以通过checked属性默认选中某一个选项
            checkbox:多选框
                可以通过checked属性默认选中某一个选项
            file:文件选择器,可以选择某一个文件
                可以通过accept属性限制所选择的文件类型
                accept属性值
                    text/html:表示只能选择HTML文件
                    text/css:只能选择CSS文件
                    text/javascript:只能选择js文件
                    text/plain:只能选择普通文本
                    text/*:所有文本
                        火狐存在浏览器兼容问题,此时会匹配一切
                        谷歌只能匹配文本
                    image/jpeg:只能匹配jpeg(jpg)格式的图片
                    image/png:只能匹配png格式的图片
                    image/gif:只能匹配gif格式的图片
                    image/*:匹配一切格式的图片
            hidden:隐藏域,在页面中没有任何东西,一般用于传递数据到后台
                表单提交时,会将隐藏域提交到后端
                但是页面中是看不到隐藏域的内容的
            submit:提交按钮,点击之后表单提交,跳转到action属性指定的地址
            reset:重置按钮,点击之后表单重置,还原为初始状态
            button:普通按钮,点击之后啥事都没发生,没有任何作用,一般在js中用于绑定事件
                value属性:按钮的名字
            image:图片按妞,作用与submit一致,使用了一张图片代替原有的提交按钮
                通过src属性指定图片地址
        name属性:当表单提交之后,后端开发人员需要根据对应表单元素的name属性值来获取用户输入的数据
            String value = request.getParameter("name属性值")
            表单提交后会以key-value的格式将数据传递到后端
            key:name属性值
            value:用户输入的值
        value属性:为当前表单元素设置默认值
        readonly:只读属性,指定后表单元素无法编辑
        disabled:使得指定表单元素失效,无法编辑,且不会将对应元素信息传递到后端
            提交时会当该表单元素不存在
        maxlength:限制表单元素输入数据的最大字符数
        minlength:限制表单元素输入数据的最小字符数
            当输入的字符串小于指定字符数,无法提交
        size:设置表单元素框的长度
    -->
    用户名:<input type="text" name="username" value="admin" maxlength="10" minlength="6" size="20"><br>
    密码:<input type="password" name="password" value="123456"  size="30"><br>
    性别:<input type="radio" name="gender" value="man" >男
        <input type="radio" name="gender" value="woman">女<br>
    兴趣:
    <input type="checkbox" name="hobbies" value="eat" checked>吃饭
    <input type="checkbox" name="hobbies" value="sleep" checked>睡觉
    <input type="checkbox" name="hobbies" value="beat" checked>打豆豆<br>
    文件:<input type="file" name="file" accept="image/*"><br>
    <input type="hidden" name="h" value="1">
    <input type="submit" value="提交">
    <!--<input type="reset" value="重置">-->
    <!--<input type="button" value="按钮">-->
    <input type="image" src="../images/login.gif">
</form>
</body>
</html>